<!-- 旧版Chrome扩展选项页 -->
<!DOCTYPE html>
<html lang="zh_CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>原神日报-配置页</title>
    <!-- layui -->
    <link rel="stylesheet" href="../layui/css/layui.css">
    <script src="../layui/layui.js"></script>

    <style>
        body {
            height: 550px;
        }
        /* 大标题 原神日报 */
        
        #optionsTitle {
            /* width: 70%; */
            margin: auto;
            font-weight: bold;
            font-size: 25px;
            /* 20px */
            text-align: center;
        }
        /* 字段集区块 设置面板 */
        
        .layui-elem-field {
            margin: auto;
            border-color: #C2C2C2;
            /* width: 60%; */
        }
        /* form */
        
        .layui-form-item {
            height: 45px;
        }
        /* form label width */
        
        .layui-form-pane .layui-form-label {
            width: 170px;
            font-size: 18px;
            font-weight: 500;
        }
        /* form 内容 */
        
        .layui-form-pane .layui-input-block {
            margin-left: 170px;
            margin-top: 5px;
        }
        
        .layui-elem-field legend {
            font-size: 20px;
            font-weight: bold;
        }
    </style>
</head>

<body>
    <!-- 导航栏 -->
    <!-- <ul class="layui-nav">
        <li class="layui-nav-item"><a href="#">配置页</a></li>
    </ul> -->

    <div class="layui-container" style="top: 1.875rem">
        <blockquote class="layui-elem-quote" id="optionsTitle">&nbsp;</blockquote>
        <fieldset class="layui-elem-field">
            <legend>设置</legend>
            <div class="layui-field-box">
                <form id="formOptions" class="layui-form  layui-form-pane" lay-filter="formOptions">
                    <div class="layui-form-item">
                        <label class="layui-form-label">刷新频率/秒</label>
                        <div class="layui-input-block">
                            <select name="refreshFrequency" lay-verify="required|refresh" id="refreshFreq">
                                <option value="10">10</option>
                                <option value="20">20</option>
                                <option value="30">30</option>
                                <option value="60">60</option>
                                <option value="300">300</option>
                                <option value="600">600</option>
                                <option value="1800">1800</option>
                                <option value="3600">3600</option>
                            </select>
                        </div>
                    </div>

                    <div style="text-align: center;font-size: 18px;">数据源开关</div>
                    <hr class="layui-border-black">

                    <div class="layui-form-item" pane>
                        <label class="layui-form-label"><img src="../img/ico/bili.ico">&nbsp;&nbsp;哔哩哔哩</label>
                        <div class="layui-input-block">
                            <input id="biliSwitch" type="checkbox" name="biliSwitch" lay-skin="switch" lay-text="ON|OFF" disabled>
                        </div>
                    </div>

                    <div class="layui-form-item" pane>
                        <label class="layui-form-label"><img src="../img/ico/weibo.ico">&nbsp;&nbsp;新浪微博</label>
                        <div class="layui-input-block">
                            <input id="weiboSwitch" type="checkbox" name="weiboSwitch" lay-skin="switch" lay-text="ON|OFF" disabled>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label" style="visibility: hidden;"></label>
                        <div class="layui-input-block">
                            <input type="button" class="layui-btn layui-btn-primary layui-border-black" lay-submit lay-filter="submitOptions" id="submitOptions" value="保存设置" style="width: 25rem;">
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
    </div>
</body>
<script src="../js/verify.js"></script>
<script src="../js/options.js"></script>

</html>